<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
        <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="ntModalLabel" type="{$request}">{$title}</h4>
            </div>
            <div class="modal-body">
                    <div class="row clearfix">
                            <div class="col-md-12 column">
                              <div class="alert alert-dismissable alert-info">
                                <button type="button" class="close">×</button>
                                <p></p>
                                </div>
                            </div>
                           </div>
               <div class="row clearfix" style="padding-top:12px">
                    <div class="col-md-12 column">
                        <ul class="nav nav-tabs"  role="tablist">
                            <li  role="presentation" class="active">
                                <a href="#home" aria-controls="home" role="tab" data-toggle="tab">{:lang('Chinese')}</a>
                            </li>
                            <li  role="presentation">
                                <a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">{:lang('English')}</a>
                            </li>
                            <li  role="presentation">
                                <a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">{:lang('Portuguese')}</a>
                            </li>
                        </ul>
                        <form class="tab-content formbox">
                            
                                <div role="tabpanel" class="tab-pane active" id="home">
                                    <table class="table table-striped table-hover ntTable">
                                        <tbody>
                                            <tr>
                                                <td class="col-md-2">{:lang("attribute_name")}<span class="required"></span></td>
                                                <td>
                                                    {if isset($selfdata)}
                                                    <input type="text" class="form-control" name="classname_zh" placeholder="{:lang("attribute_name")}" value="{:lang($selfdata.name_zh)}" data-id="{$selfdata.id}">
                                                    {else /}
                                                    <input type="text" class="form-control" name="classname_zh" placeholder="{:lang("attribute_name")}" >
                                                    {/if}
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>{:lang("attribute_value")}<span class="required"></span></td>
                                                <td>
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" value="">
                                                        <span class="input-group-btn">
                                                            <button class="btn btn-default addbtn" data-lang="zh"  type="button"><span class="glyphicon glyphicon-plus"></span> {:lang('add')}</button>
                                                        </span>
                                                    </div><!-- /input-group -->
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>&nbsp;</td>
                                                <td class="arrrlist">
                                                    {if isset($selfdata.valuename)}
                                                        {foreach $selfdata.valuename.zh as $k=>$v}
                                                            <div class="col-md-3 col-sm-4 col-xs-6 valitem" style="padding:4px">
                                                                <div class="input-group input-group-sm">
                                                                    <input type="text" class="form-control" name="val_zh" value="{$v.value}" data-id="{$v.mkey}">

                                                                    <span class="input-group-btn">
                                                                        <button type="button" class="btn btn-default">
                                                                            <span class="glyphicon glyphicon-pencil" style="margin:0"></span>
                                                                        </button>
                                                                        <button type="button" class="btn btn-default delbtn">
                                                                            <span class="glyphicon glyphicon-remove" style="margin:0"></span>
                                                                        </button>
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        {/foreach}
                                                    {/if}
                                                </td>
                                            </tr>           
                                            <tr>
                                                <td>{:lang('status')}</td>
                                                <td class="status">
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_zh" value="1"  {if isset($selfdata)}{if ($selfdata.status ==1)}checked{/if}{/if} {if condition="$request eq 'add'"}checked{/if}> {:lang('normal')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_zh" value="3" {if isset($selfdata)}{if ($selfdata.status ==3)}checked{/if}{/if} > {:lang("hide")}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_zh" value="2" {if isset($selfdata)}{if ($selfdata.status ==2)}checked{/if}{/if} > {:lang('delete')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_zh" value="4" {if isset($selfdata)}{if ($selfdata.status ==4)}checked{/if}{/if} > {:lang("off_the_shelf")}
                                                    </label>
                                                </td>

                                            <tr>
                                                <td>{:lang('universal')}</td>
                                                <td class="general">
                                                    
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="general_zh" value="1"  {if isset($selfdata)}{if ($selfdata.is_public ==1)}checked{/if}{/if} > {:lang('yes')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="general_zh" value="2"  {if isset($selfdata)}{if ($selfdata.is_public ==2)}checked{/if}{/if} {if condition="$request eq 'add'"}checked{/if}> {:lang('no')}
                                                    </label>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>

                                <div role="tabpanel" class="tab-pane" id="profile">
                                    <table class="table table-striped table-hover ntTable">
                                        <tbody>
                                                <tr>
                                                <td class="col-md-2">{:lang('proattr')}{:lang('name')}<span class="required"></span></td>
                                                <td>
                                                    {if isset($selfdata)}
                                                    <input type="text" class="form-control" name="classname_en" placeholder="{:lang('proattr')}{:lang('name')}" value="{:lang($selfdata.name_en)}" data-id="{$selfdata.id}">
                                                    {else /}
                                                    <input type="text" class="form-control" name="classname_en" placeholder="{:lang('proattr')}{:lang('name')}">
                                                    {/if}
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>{:lang('proattr')}{:lang('value')}<span class="required"></span></td>
                                                <td>
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" value="">
                                                        <span class="input-group-btn">
                                                            <button class="btn btn-default addbtn" data-lang="en" type="button"><span class="glyphicon glyphicon-plus"></span> {:lang('add')}</button>
                                                        </span>
                                                    </div><!-- /input-group -->
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>&nbsp;</td>
                                                <td class="arrrlist">
                                                    {if isset($selfdata.valuename)}
                                                        {foreach $selfdata.valuename.en as $k1=>$v1}
                                                            <div class="col-md-3 col-sm-4 col-xs-6 valitem" style="padding:4px">
                                                                <div class="input-group input-group-sm">
                                                                    <input type="text" class="form-control" name="val_en" value="{$v1.value}" data-id="{$v1.mkey}">
                                                                    <span class="input-group-btn">
                                                                        <button type="button" class="btn btn-default">
                                                                            <span class="glyphicon glyphicon-pencil" style="margin:0"></span>
                                                                        </button>
                                                                        <button type="button" class="btn btn-default delbtn">
                                                                            <span class="glyphicon glyphicon-remove" style="margin:0"></span>
                                                                        </button>
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        {/foreach}
                                                    {/if}
                                                </td>
                                            </tr>                        
                                            <tr>
                                                <td>{:lang('status')}</td>
                                                <td class="status">
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_en" value="1"  {if isset($selfdata)}{if ($selfdata.status ==1)}checked{/if}{/if} {if condition="$request eq 'add'"}checked{/if}> {:lang('normal')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_en" value="3" {if isset($selfdata)}{if ($selfdata.status ==3)}checked{/if}{/if} > {:lang("hide")}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_en" value="2" {if isset($selfdata)}{if ($selfdata.status ==2)}checked{/if}{/if} > {:lang('delete')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_en" value="4" {if isset($selfdata)}{if ($selfdata.status ==4)}checked{/if}{/if} > {:lang("off_the_shelf")}
                                                    </label>
                                                </td>

                                            <tr>
                                                <td>{:lang('universal')}</td>
                                                <td class="general">
                                                    
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="general_en" value="1"  {if isset($selfdata)}{if ($selfdata.is_public ==1)}checked{/if}{/if} > {:lang('yes')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="general_en" value="2"  {if isset($selfdata)}{if ($selfdata.is_public ==2)}checked{/if}{/if} {if condition="$request eq 'add'"}checked{/if}> {:lang('no')}
                                                    </label>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>

                                <div role="tabpanel" class="tab-pane" id="messages">
                                    <table class="table table-striped table-hover ntTable">
                                        <tbody>
                                                <tr>
                                                <td class="col-md-2">{:lang('proattr')}{:lang('name')}<span class="required"></span></td>
                                                <td>
                                                    {if isset($selfdata)}
                                                    <input type="text" class="form-control" name="classname_pt" placeholder="{:lang('proattr')}{:lang('name')}" value="{:lang($selfdata.name_pt)}" data-id="{$selfdata.id}">
                                                    {else /}
                                                    <input type="text" class="form-control" name="classname_pt" placeholder="{:lang('proattr')}{:lang('name')}" >
                                                    {/if}
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>{:lang('proattr')}{:lang('value')}<span class="required"></span></td>
                                                <td>
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" value="">
                                                        <span class="input-group-btn">
                                                            <button class="btn btn-default addbtn" data-lang="pt" type="button"><span class="glyphicon glyphicon-plus"></span> adicionar</button>
                                                        </span>
                                                    </div><!-- /input-group -->
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>&nbsp;</td>
                                                <td class="arrrlist">
                                                    {if isset($selfdata.valuename)}
                                                        {foreach $selfdata.valuename.pt as $k2=>$v2}
                                                            <div class="col-md-3 col-sm-4 col-xs-6 valitem" style="padding:4px">
                                                                <div class="input-group input-group-sm">
                                                                    <input type="text" class="form-control" name="val_pt" value="{$v2.value}" data-id="{$v2.mkey}">
                                                                    <span class="input-group-btn">
                                                                        <button type="button" class="btn btn-default">
                                                                            <span class="glyphicon glyphicon-pencil" style="margin:0"></span>
                                                                        </button>
                                                                        <button type="button" class="btn btn-default delbtn">
                                                                            <span class="glyphicon glyphicon-remove" style="margin:0"></span>
                                                                        </button>
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        {/foreach}
                                                    {/if}
                                                </td>
                                            </tr>                        
                                            <tr>
                                                <td>{:lang('status')}</td>
                                                <td class="status">
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_pt" value="1"  {if isset($selfdata)}{if ($selfdata.status ==1)}checked{/if}{/if} {if condition="$request eq 'add'"}checked{/if}> {:lang('normal')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_pt" value="3" {if isset($selfdata)}{if ($selfdata.status ==3)}checked{/if}{/if} > {:lang("hide")}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_pt" value="2" {if isset($selfdata)}{if ($selfdata.status ==2)}checked{/if}{/if} > {:lang('delete')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="radio_pt" value="4" {if isset($selfdata)}{if ($selfdata.status ==4)}checked{/if}{/if} > {:lang("off_the_shelf")}
                                                    </label>
                                                </td>

                                            <tr>
                                                <td>{:lang('universal')}</td>
                                                <td class="general">
                                                    
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="general_pt" value="1"  {if isset($selfdata)}{if ($selfdata.is_public ==1)}checked{/if}{/if} > {:lang('yes')}
                                                    </label>
                                                    <label class="checkbox-inline">
                                                        <input type="radio" name="general_pt" value="2"  {if isset($selfdata)}{if ($selfdata.is_public ==2)}checked{/if}{/if} {if condition="$request eq 'add'"}checked{/if}> {:lang('no')}
                                                    </label>
                                                </td>
                                            </tr>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </form>
                    </div>
                </div>
                



            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span>{:lang('cancel')}</button>
                <button type="button" class="btn btn-primary save" style="padding-left:24px;padding-right:24px"><span class="glyphicon glyphicon-floppy-disk"></span>{:lang('save')}</button>
            </div>
    <script>
        $('.addbtn').click(function(){
            var attrval=$(this).parents('.input-group').find('input').val()
            var langarr=['zh','en','pt']
            if(attrval){
                for(var i=0;i<langarr.length;i++){
                    var element='<div class="col-md-3 col-sm-4 col-xs-6 valitem" style="padding:4px">                                                                <div class="input-group input-group-sm">                                                                    <input type="text" class="form-control" name="val_'+langarr[i]+'" value="'+attrval+'" data-id="">                                                                    <span class="input-group-btn">                                                                        <button type="button" class="btn btn-default">                                                                            <span class="glyphicon glyphicon-pencil" style="margin:0"></span>                                                                        </button>                                                                        <button type="button" class="btn btn-default delbtn">                                                                            <span class="glyphicon glyphicon-remove" style="margin:0"></span>                                                                        </button>                                                                    </span>                                                                </div>                                                            </div>'
                    $('.arrrlist').eq(i).append(element)
                }
                $(this).parents('.input-group').find('input').val('')
                $('.delbtn').click(function(){
                    if($('.arrrlist .valitem').length>1){
                        var index=$(this).parents('.valitem').index()
                        for(var i=0;i<3;i++){
                            $('.arrrlist').eq(i).find('.valitem').eq(index).remove()
                        }
                    }
                })
            }
        })
        $('.delbtn').click(function(){
            if($('.arrrlist .valitem').length>1){
                var index=$(this).parents('.valitem').index()
                for(var i=0;i<3;i++){
                    $('.arrrlist').eq(i).find('.valitem').eq(index).remove()
                }
            }
        })
        function collect(data,lang,index){
            var modaat={
                classname:{
                    id:$("input[name$='classname_"+lang+"']").attr('data-id'),
                    val:$("input[name$='classname_"+lang+"']").val()
                },
                    valarr:[],
                    state:'',
                    public:'',
                    general:''
            }
            $("input[name$='val_"+lang+"']").each(function(index,item){
                    var did=$(this).attr('data-id')
                    if(did){
                        modaat.valarr.push({
                            id:did,
                            val:item.value
                        })
                    }else{
                        modaat.valarr.push({
                            id:'new'+index,
                            val:item.value
                        })
                    }
                })
                
            data.forEach(element => {
                if(element.name=="radio_"+lang){
                    modaat.state=element.value
                }

            });
            data.forEach(element => {
                if(element.name=="general_"+lang){
                    modaat.general=element.value
                }

            });
            return modaat
        }
         $('.save').click(function(){
            
            if($('#ntModalLabel').attr('type') == 'edit'){
                var url = '/admin/proattr/attrEdit?request=update';
            }else if($('#ntModalLabel').attr('type') == 'add'){
                var url = '/admin/proattr/attrAdd?request=insert';
            }

            var modul={}
            data=$('.formbox').serializeArray()
            // console.log(data)
            modul.zh=collect(data,'zh')
            modul.en=collect(data,'en')
            modul.pt=collect(data,'pt')
            //console.log(modul)
            $.ajax({
                // url:'/admin/product/attrEdit?request=update',
                url:url,
                type:'post',
                data:modul,
                success:function(data){
                    data = JSON.parse(data)
                    if(data.status==1){
                        change_mes_type('.alert',data.status)
                        $('.alert').show()
                        $('.alert p').html('*'+data.msg+'<br>')
                        $('#proatt_editModal').modal('hide')
                    }else{
                        change_mes_type('.modal-body .alert',data.status)
                        //toastr.warning(data.msg);
                        $('.modal-body .alert').show()
                        $('.modal-body .alert p').html('*'+data.msg+'<br>')
                    }
                }
            })
        })
        $('.status input').change(function(){
            var val=$(this).val()
            $('.status input').each(function(index,item){
                if($(item).val()==val){
                    $(item).prop('checked',true)
                }else{
                    $(item).prop('checked',false)
                }
            })
        })
        $('.general input').change(function(){
            var val=$(this).val()
            $('.general input').each(function(index,item){
                if($(item).val()==val){
                    $(item).prop('checked',true)
                }else{
                    $(item).prop('checked',false)
                }
            })
        })
        $(document).keydown(function (event) {
        if (event.keyCode == 13) {
            $('.save').click()
        }
        });
    </script>
</body>
</html>